#myJoin {

  .content {
    width: 100%;
    height: 100%;
    overflow: hidden;

    .searchBox {
      position: relative;
      padding: 10px 10px;
      font-size: 0;

      div {
        width: 100%;
        height: 0.8rem;
        background: #F4F4F4;
        outline: none;
        padding-left: 0.8rem;
        font-size: 0.3rem;
        border-radius: 0.1rem;
        color: #696969;
        line-height: .8rem;
      }
    }


  }

  .new {
    height: 100%;
  }

  .content i {
    position: absolute;
    top: 50%;
    left: 0.4rem;
    font-size: 0.4rem;
    color: gray;
    transform: translateY(-50%);
  }


  input::-webkit-input-placeholder {
    color: #B0B4B7;

  }

  .buyBox {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 1.3rem;

  }

  .buyList {
    padding: .28rem .2rem 1rem .2rem;
  }

  .content .square {
    margin-bottom: 0.6rem;
    width: 100%;
    height: 2.5rem;
    position: relative;
    border-radius: 5px;
    box-shadow: 3px 5px 8px rgba(204, 204, 204, 0.2);

    .imgShadow {
      position: absolute;
      left: 0.2rem;
      top: -0.3rem;
      box-shadow: 1px 1px 4px rgba(0, 0, 0, .1);
      width: 1.7rem;
      height: 100%;
      border-radius: 5px;
      overflow: hidden;
    }
  }

  .content .square img {

    width: 100%;
    height: 100%;

    object-fit: cover;
  }

  .content .square .right {
    float: right;
    width: 65%;
    height: 100%;
    /*background: green;*/
    margin-right: 0.2rem;
  }

  .content .square .right .rightContent {
    width: 100%;
    height: 1.4rem;
    border-bottom: solid 1px #DEDFE1;
  }

  .content .square .right .rightContent .p1 {
    font-size: 0.34rem;
    color: #000;
    margin-top: 0.2rem;
  }

  .content .square .right .rightContent .p2 {
    font-size: 0.24rem;
    color: #B0B4B7;
    margin-top: 0.1rem;
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .content .square .right .p3 {
    width: 100%;
    line-height: 0.9rem;

  }

  .content .square .right .p3 span {
    float: left;
    font-size: 0.24rem;
    color: #B0B4B7;
  }

  .content .square .right .p3 .circle {
    float: right;
    width: 0.08rem;
    height: 0.08rem;
    border-radius: 50%;
    background: #D94237;
    margin-top: 0.35rem;
    margin-right: 0.1rem;
  }


  .maskSubstance .share .left, .right {
    text-align: left;
  }
}
